<template>
    <div>
        <div v-for="(item, index) in dataList" :key="item.id" class="content-card">
            <a class="card-title" :href="'/art-detail/'+item.article_id">{{item.article_title}}</a>
            <br>
            <div class="card-info">
                <span class="card-create-time">{{item.article_create_time}}</span>
                <!--<span class="card-author">{{item.article_author.user_name}}</span>-->
                <!--<a class="card-tag" href="/art-detail">-->
                <!--<span>· </span>-->
                <!--{{item.article_type.article_type_name}}-->
                <!--</a>-->
            </div>
            <div class="card-detail">
                <div v-html="markdownData(index)" class="info"></div>
            </div>
        </div>

    </div>
</template>
<script>
    import marked from 'marked'

    export default {
        computed: {},
        components: {},
        data: function () {
            return {
                currentDate: new Date()
            }
        },
        props: {
            dataList: {
                type: Array,
                default () {
                    return []
                }
            }
        },
        methods: {
            markdownData (index) {
                return marked(this.dataList[index].article_info || '', {gfm: true, smartLists: true, breaks: true})
            }
        }
    }
</script>

<style lang="scss">
    @import "contentCard.scss";
</style>
